Estructura del lunguaje HTML

  1. Entidades
  2. Comentarios
  3. Atributos globales
  4. Elememtos de bloque
  5. Elememtos de linea
  6. Etiquetas para marcar partes
  7. Etiquetas de maquetacion de paginas

Entidades

Las entidades (named-characters) nos permiten representar algunos caracteres que para el navegador tienen un significado distinto porque forman parte del lenguaje html. Las entidades se escriben empezando por el carácter & y terminando en ;

entidades
CaracterEntidad
&
&
 
 
<
&lt;
>
&gt;
"
&quot;
©
&copy;
'
&apos;

Comentarios

Los elementos que llamamos comentarios no tienen ningún efecto sobre la página (no se muestran). Su único objetivo es facilitar la labor de los desarrolladores web cuando estos consulten el código de la página, añadiendo las explicaciones oportunas en los distintos elementos.

Para incluirlos en nuestro documento html se hace entre los siguientes símbolos <!-- -->

<!-- Aqui iria el comentario

que puede ocupar una o varias lineas-->

Atributos globales

Llamamos atributos globales a aquellos atributos que podemos incluir en cualquier etiqueta.

Principales atributos globales

Atributo
Descripcion
id
Nombre con el que identificamos el elemento de forma única en el documento (es decir, el nombre que le pongamos no se puede repetir en ningún otro elemento.
style
Permite asignar estilos (css) a un elemento.
class
Permite identificar varios elementos como pertenecientes a un mismo grupo (clase) para posteriormente aplicar a todos ellos los mismos estilos.
lang
Especifica el idioma del contenido del elemento
title
Información extra del elemento (tooltip).
contenteditable
Si existe, el contenido del elemento es editable
hidden
Si existe, el elemento no se representa

Otros atributos globales son: accesskey, tabindex, draggable, spellcheck, translate y dir. Además de estos atributos, existen los atributos de eventos: onclick, onmouseover, ondoubleclick, onchange, onfocus, ...

Ejemplos de uso

En este párrafo se muestra el uso del atributo title

Este otro párrafo tiene el atributo contenteditable por lo que podemos modificar su contenido (pero eso no quiere decir que se vaya a guardar).

Este es un párrafo de los que se llaman draggable (arrastrable) que nos dice si un elemento es arrastrable o no.

Elememtos de bloque que no hemos visto

Hemos utilizado los siguientes:

<h1>...<h6><p><hr>

<ol><ul><li><dl>

<dd><dt><table><tr>

<td><br>

<address>
Sirve para incluir información de contacto. Ejemplo: Puedes contactar con el profesor en su dirección:

Calle Malaspenas nºXX

3700x Salamanca
<blockquote>
Se utiliza para añadir una sección que se cita de otro texto o documento (es una "cita larga", que ocupa varias líneas). Se suele acompañar del atributo cite que contiene la referencia a la fuente de la cita. Ejemplo:

Ya nos explico Cervantes como deberiamos comportarnos:

No comas ajos ni cebollas, porque no saquen por el olor tu villanería. Anda despacio; habla con resposo; pero no de manera que parezca que te escuchas a ti mismo; que toda afectación es mala. Come poco y cena más poco; que la salud de todo el cuerpo se fragua en la oficina del estómago. Sé templado en el beber, considerando que el vino demasiado ni guarda secreto, ni cumple palabra. Ten cuenta, Sancho, de no mascar a dos carrillos, ni de erutar delante de nadie.